<%@ page contentType="text/html;charset=UTF-8" %>
<%@ page import="org.apache.shiro.web.filter.authc.FormAuthenticationFilter"%>
<%@ page import="org.apache.shiro.authc.ExcessiveAttemptsException"%>
<%@ page import="org.apache.shiro.authc.IncorrectCredentialsException"%>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<html>
<head>
	<title>登录页</title>
	<link rel="stylesheet" href="${ctx}/static/plugin/bootstrap/css/bootstrap.min.css"  />
	<script>
		
		if (top.location != self.location){
			top.location=self.location;
			top.location = "${ctx}/main/main";
		}
		
		$(document).ready(function() {
			form_wrapper = $('.login_box');
                $('.linkform a,.link_reg a').on('click',function(e){
					var target	= $(this).attr('href'),
						target_height = $(target).actual('height');
					$(form_wrapper).css({
						'height'		: form_wrapper.height()
					});	
					$(form_wrapper.find('form:visible')).fadeOut(400,function(){
						form_wrapper.stop().animate({
                            height	: target_height
                        },500,function(){
                            $(target).fadeIn(400);
                            $('.links_btm .linkform').toggle();
							$(form_wrapper).css({
								'height'		: ''
							});	
                        });
					});
					e.preventDefault();
				});
				
				//* validation
				$('#loginForm').validate({
					onkeyup: false,
					errorClass: 'error',
					validClass: 'valid',
					rules: {
						username: { required: true},
						password: { required: true}
					},
					messages: {
	   					username: "请输入登录账号",
	   					password: "请输入登录密码"
	  				},
					highlight: function(element) {
						$(element).closest('div').addClass("f_error");
					},
					unhighlight: function(element) {
						$(element).closest('div').removeClass("f_error");
					},
					errorPlacement: function(error, element) {
						$(element).closest('div').append(error);
					}
				});
				
		});
	</script>
	<style type="text/css">
		.login_page  {margin:40px 20px 20px}
		.login_page .login_box {width:380px;margin:0 auto;background:#fff;border:1px solid #ccc;-webkit-border-radius: 6px;-moz-border-radius: 6px;-ms-border-radius: 6px;border-radius: 6px;-webkit-box-shadow: 0 0 6px rgba(0,0,0,0.2);-moz-box-shadow: 0 0 6px rgba(0,0,0,0.2);-ms-box-shadow: 0 0 6px rgba(0,0,0,0.2);box-shadow: 0 0 6px rgba(0,0,0,0.2);margin-bottom:10px}
		.login_page .top_b {text-shadow:0 1px 0 rgba(255,255,255,.5);font: 100 18px/42px 'PT Sans', sans-serif;height:42px;padding:0 20px;background: #e0e0e0;border-bottom:1px solid #ccc;-moz-border-radius-topleft: 6px;-moz-border-radius-topright: 6px;-moz-border-radius-bottomright: 0px;-moz-border-radius-bottomleft: 0px;-webkit-border-radius: 6px 6px 0px 0px;border-radius: 6px 6px 0px 0px;font-size:15px}
		.login_page .cnt_b {padding:30px 0;width:66%;margin:0 auto}
		.login_page form {margin-bottom:0}
		.login_page .btm_b {padding:12px 20px;border-top:1px solid #e7e7e7;background:#f7f7f7;-moz-border-radius-topleft: 0px;-moz-border-radius-topright: 0px;-moz-border-radius-bottomright: 6px;-moz-border-radius-bottomleft: 6px;-webkit-border-radius: 0px 0px 6px 6px;border-radius: 0px 0px 6px 6px}
		.login_page .links_b {font-size:11px;text-align:center}
		.login_page .link_reg {font-size:11px;padding:5px 0 0;display:block}
		.alert-login {margin:10px 10px 0}
	</style>
</head>
<body>
	<div class="login_page">
		<div class="login_box">
			<form:form id="loginForm" name="loginForm" action="${ctx}/login" method="post">
				<div class="top_b">唯爱婚礼后台管理</div>    
				<div class="alert alert-info alert-login">
					<%
						String error = (String) request.getAttribute(FormAuthenticationFilter.DEFAULT_ERROR_KEY_ATTRIBUTE_NAME);
						if(error != null){
					%>
						<font color="red">登录名或者密码错误，登录失败，请重试.</font>
						
					<%
						}else{
						
					%>
						请输入用户名和密码.
					
					<%
						}
					%>
				</div>
				<div class="cnt_b">
					<div class="formRow">
						<div class="input-prepend">
							<span class="add-on">
								<i class="icon-user"></i>
							</span>
							<input type="text" class="required" id="username" name="username" placeholder="Username" value="" />
						</div>
					</div>
					<div class="formRow">
						<div class="input-prepend">
							<span class="add-on">
								<i class="icon-lock"></i>
							</span>
							<input type="password" class="required" id="password" name="password" placeholder="Password" value="" />
						</div>
					</div>
				</div>
				<div class="btm_b clearfix">
					<button class="btn btn-inverse pull-right" type="submit">登 录</button>
					
				</div>  
			</form:form>
			</div>
       </div>
    </body>
</html>
